<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>08_RegExp-正则表达式创建</title>
  <!-- 
  在 JavaScript 中，正则表达式是一种强大的文本处理工具，可以用来匹配、搜索和替换字符串。正则表达式由一系列特殊符号和字符组成，这些符号和字符定义了匹配的规则。
  一、基本符号
  1.  `.` （点）
    - 匹配除换行符（ `\n` ）之外的任意单个字符。
    - 示例： `/a.b/`  可以匹配  `acb` 、 `a1b`  等。

  2.  `^` （脱字符）
    - 匹配输入字符串的开始位置。
    - 示例： `/^abc/`  可以匹配以  `abc`  开头的字符串。

  3.  `$` （美元符号）
    - 匹配输入字符串的结束位置。
    - 示例： `/abc$/`  可以匹配以  `abc`  结尾的字符串。

  4.  `*` （星号）
    - 匹配前面的子表达式零次或多次。
    - 示例： `/ab*c/`  可以匹配  `ac` 、 `abc` 、 `abbc`  等。

  5.  `+` （加号）
    - 匹配前面的子表达式一次或多次。
    - 示例： `/ab+c/`  可以匹配  `abc` 、 `abbc` ，但不匹配  `ac` 。

  6.  `?` （问号）
    - 匹配前面的子表达式零次或一次。
    - 示例： `/ab?c/`  可以匹配  `ac`  或  `abc` 。

  7.  `{n}` （花括号）
    - 精确匹配前面的子表达式 n 次。
    - 示例： `/a{3}/`  可以匹配  `aaa` 。

  8.  `{n,}` （花括号）
    - 匹配前面的子表达式至少 n 次。
    - 示例： `/a{2,}/`  可以匹配  `aa` 、 `aaa` 、 `aaaa`  等。

  9.  `{n,m}` （花括号）
    - 匹配前面的子表达式至少 n 次，但不超过 m 次。
    - 示例： `/a{1,3}/`  可以匹配  `a` 、 `aa` 、 `aaa` 。

  二、字符类
  1.  `[abc]` 
    - 匹配方括号内的任一字符。
    - 示例： `/[abc]/`  可以匹配  `a` 、 `b`  或  `c` 。

  2.  `[^abc]` 
    - 匹配不在方括号内的任一字符。
    - 示例： `/[^abc]/`  可以匹配任何不为  `a` 、 `b`  或  `c`  的字符。

  3.  `[a-z]` 
    - 匹配范围内的任一字符。
    - 示例： `/[a-z]/`  可以匹配任何小写字母。

  4.  `\d` 
    - 匹配任何数字，等价于  `[0-9]` 。
    - 示例： `/\d/`  可以匹配  `1` 、 `2`  等。

  5.  `\D` 
    - 匹配任何非数字字符，等价于  `[^0-9]` 。
    - 示例： `/\D/`  可以匹配字母、符号等。

  6.  `\w` 
    - 匹配任何字母数字字符，包括下划线，等价于  `[a-zA-Z0-9_]` 。
    - 示例： `/\w/`  可以匹配  `a` 、 `1` 、 `_`  等。

  7.  `\W` 
    - 匹配任何非字母数字字符，等价于  `[^a-zA-Z0-9_]` 。
    - 示例： `/\W/`  可以匹配空格、符号等。

  8.  `\s` 
    - 匹配任何空白字符，包括空格、制表符和换行符。
    - 示例： `/\s/`  可以匹配空格、 `\t`  等。

  9.  `\S` 
    - 匹配任何非空白字符。
    - 示例： `/\S/`  可以匹配字母、数字等。

  三、分组与捕获
  1.  `(abc)` 
    - 匹配  `abc`  字符串，并将其捕获为一个组。
    - 示例： `/(abc)/`  可以匹配  `abc` ，并捕获该字符串。

  2.  `(?:abc)` 
    - 匹配  `abc`  字符串，但不捕获该组（非捕获组）。
    - 示例： `/(?:abc)/`  可以匹配  `abc` ，但不捕获。

  3.  `(?<name>abc)` 
    - 匹配  `abc`  字符串，并将其命名为  `name`  的组。
    - 示例： `/(?<name>abc)/`  可以匹配  `abc` ，并为其命名。

  四、其他
  1.  `|` （竖线）
    - 表示逻辑“或”，用于匹配多个选择。
    - 示例： `/a|b/`  可以匹配  `a`  或  `b` 。

  2.  `\`（反斜杠）
    - 用于转义特殊字符，使其失去特殊意义。
    - 示例：` /\./ ` 可以匹配一个点字符 ` .`。

  五、总结
  正则表达式的符号和语法使得文本处理变得灵活而强大。通过合理使用这些符号，可以实现复杂的字符串匹配、搜索和替换操作。了解这些符号的含义和用法是掌握正则表达式的基础。
  -->
</head>
<body>

  <script>
    // 1. 通过字面量创建
    let reg1 = /abc/
    console.log(reg1.test('abc123')) // true
    console.log(reg1.test('abc')) // true
    console.log(reg1.test('aabc')) // true
    console.log(reg1.test('123abc')) // true

    // 2. 通过构造函数创建
    let reg2 = new RegExp('abc')
    console.log(reg2.test('abc123')) // true

    // 3. 通过字面量创建
    let reg3 = /abc/
    let reg4 = new RegExp('abc')
    console.log(reg3 === reg4) // false

    // 4. 练习
    const message = "dabc123 faBC323 dabc222 abc4aaBc cbadddvabcba."
    const newMsg = message.replaceAll(/abc/gi, '*')
    console.log(newMsg);
    
    // 需求: 将字符串中数字全部删除
    const str = 'abc123abc456abc789'
    const newStr = str.replaceAll(/\d+/g, '')
    console.log(newStr);
    

  </script>
  
</body>
</html>